<template>
    <div>
        <div class="Theheadofdata">
            <div class="namu1 namu">
                <div class="div1">
                    <img src="../rui2/imgs/in1.gif" alt="">
                    <div class="div2">
                        <span class="span1">预约人数</span>
                        <h2>{{total1}}</h2>
                    </div>

                </div>
            </div>
            <div class="namu2 namu">
                <div class="div1">
                    <img src="../rui2/imgs/in2.gif" alt="">
                    <div class="div2">
                        <span class="span1">挂号人数</span>
                        <h2>{{total1}}</h2>
                    </div>
                </div>

            </div>
            <div class="namu3 namu">
                <div class="div1">
                    <img src="../rui2/imgs/in3.gif" alt="">
                    <div class="div2">
                        <span class="span1">充值金额</span>
                        <h2>36000</h2>
                    </div>
                </div>

            </div>
            <div class="namu4 namu">
                <div class="div1">
                    <img src="../rui2/imgs/in4.gif" alt="">
                    <div class="div2">
                        <span class="span1">绑卡人数</span>
                        <h2>240</h2>
                    </div>
                </div>

            </div>

        </div>
    </div>

</template>

<script>
import { zhurui } from '../../../api/interface'
export default {
    data(){
        return{
            total1:''
        }

    },
    mounted() {
        this.xuanran111()
    },
    methods: {

        xuanran111() {
            zhurui().then(res => {
                console.log(res);
                if (res.code == 200) {
                    this.arr = res.data
                    this.total1 = res.total
                }
                // console.log(this.keyword,this.page,this.pageSize);
                
                // this.total1=total
                console.log(this.total1);
                this.$emit('dongtaishuju', this.total) //动态总数传给数表

            })
        }
    },




}
</script>

<style>
</style>

<style lang="less" scoped>
.Theheadofdata {
    width: 1100px;
    height: 130px;
    // background: sandybrown;
    display: flex;

    .namu {
        width: 250px;
        height: 120px;
        background: #ffffff;
        margin-left: 20px;
        display: flex;
        align-items: center;
        border-radius: 8px;
        box-shadow: 0px 0px 4px darkgray;


        .div1 {
            display: flex;
            margin-left: 34px;

            .span1 {
                font-size: 17px;
                color: #8998bc;
                font-weight: 500;

            }

            h2 {
                font-size: 25px;
                font-weight: 900;
                margin-top: 20px;
                color: #25396f;
                display: block;
            }

            .div2 {
                margin-left: 10px;
            }
        }
    }

}

img {
    width: 60px;
    height: 60px;
}
</style>